<template>
	<view class="body">
		<view class="submit">
			<!-- <view @click="submit(index)" :class=" == index?'action':''" v-for="(item,index) in submitname" :key="index">{{item.submit}}
				<block v-if="submitname[index].submit=='已提交'">({{submitname[0].name.length}})</block>
				<block v-if="submitname[index].submit=='未提交'">({{submitname[1].name.length}})</block>
			</view> -->
			<view :class="{action: currentIndex==0}" @click="change(0)">
				已提交({{list.committerInfo ? list.committerInfo.length : 0}})
			</view>
			<view :class="{action: currentIndex==1}" @click="change(1)">
				未提交({{list.unCommitterInfo ? list.unCommitterInfo.length : 0}})
			</view>
		</view>
		<scroll-view v-show="currentIndex==0" scroll-y class="scrollSty">
			<view class="name" v-for="(item,index) in list.committerInfo" :key="item.id">
				<view class="nameview">
					<image class="image" :src="item.photo || '../../static/images/Avatar.png'"></image>
					{{item.name}}
					<view class="iicon"><image src="../../static/icon/More.png"></image></view>
				</view>
			</view>
		</scroll-view>
		<scroll-view v-show="currentIndex==1" scroll-y class="scrollSty">
			<view class="name" v-for="(item,index) in list.unCommitterInfo" :key="item.id">
				<view class="nameview">
					<image class="image" :src="item.photo || '../../static/images/Avatar.png'"></image>
					{{item.name}}
					<view class="iicon"><image src="../../static/icon/More.png"></image></view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: 0,
				list: [],
				currentIndex:0,
				// submitname:[
				// 	{submit:'已提交',name:[{disname:'Arrtin',pic:''},{disname:"Arrtin2",pic:""},{disname:"Arrtin3",pic:""},{disname:"Arrtin4",pic:""},{disname:"Arrtin5",pic:""}]},
				// 	{submit:'未提交',name:[{disname:"Arrtin1",pic:""},{disname:"Arrtin2",pic:""},{disname:"Arrtin3",pic:""},{disname:"Arrtin4",pic:""}],},
				// ],
			}
		},
		methods: {
			change(index){
				this.currentIndex=index;
			},
			// submit(index){
			// 	console.log(index);
			// 	this.currentindex=index;
			// },
			async getList(){
				const res = await this.$myRequest({
					url: '/voting/getCommitterAndUnCommitterInformation/'+this.id
				})
				this.list = res.data.data
				console.log(this.list);
			}
		},
		onLoad(option) {
			this.id = option.id
			this.getList()
		}
	}
</script>

<style lang="scss" scoped>
	.body{
		background-color: #f7f7f7;
		padding-top: 1vh;
		height: 100%;
		/* 提交栏 */
		.submit{
			display: flex;
			background-color: #ffffff;
			height: 9vh;
			margin: 1vh 0vh 2vh 0vh;
			color: #b4b4b4;
			view{
				width: 50vw;
				text-align: center;
				line-height: 9vh;
				font-size: 35upx;
			}
		}
		.scrollSty{
			height: 100%;
			overflow: hidden;
		}
	}
	
	.action{
		color: #007AFF;
		border-bottom: #007AFF 4px solid;
	}
	.name{
		display: flex;
		position: relative;
		background-color: #ffffff;
		height: 150upx;
		font-size: 35upx;
		padding-left: 4vw;
	}
	.nameview{
		display: flex;
		align-items: center;
	}
	
	.image{
		width: 100upx;
		height: 100upx;
		border-radius: 50%;
		margin-right: 4vw;
	}
	.iicon{
		z-index: 9999;
		position: absolute;
		right: 4vw;
		image{
			margin-left: 4vw;
			width: 50upx;
			height: 50upx;
		}
	}
</style>
